کامپایل کردن سورس بوت استرپ به CSS
نوشته شده توسط : مهمان نواز


بوت استرپ چه می‌باشد
بوت استرپ، دوست داستنی ترین فریمورک CSS می‌باشد که بوسیله طراحی سایت شرکتی کمپانی توییتر تاسیس شده است. بوت استرپ گروه ای از ابزارهای مجانی در پباده سازی صفحه های اینترنت که به طور تقریب در مجموع پروژه های اینترنت استعمال می‌گردد را از پیش پباده سازی کرده و در چنگ یوزرها خویش قرار داده میباشد. ساخت وب سایت با به کارگیری از بوت استرپ بسیار سریع و شادی بخش میباشد. درصورتی که در خصوص بوت استرپ اطلاعاتی ندارید، نوشته ی علمی بوت استرپ چه است را مطالعه نمایید.

فولدر های SCSS
در تیم بوت استرپ که بوسیله کمپانی توییتر ارائه شده‌است، فولدر هایی با پسوند SCSS وجود دارا‌هستند. در واقع این پوشه ها، سورس بوت استرپ میباشند. این موسسه در فایل SCSS در محل اساسی تیم بوت استرپ جای‌دارد که مشتمل بر منوها، جداول، متغیرها، فرم ها و کل عناصری که در پوشه CSS بوت استرپ مستعمل میباشد. بوت استرپ در فایلی به اسم bootstrap.scss همه پوشه های SCSS را لود کرده و با به کارگیری از طریق هایی، این فولدر ها را به یک پوشه با اسم bootstrap.css کامپایل می نماید.

عوارض کامپایل کردن فولدر های SCSS بوت استرپ به CSS
طرز هایی برای کامپایل کردن پوشه های SCSS به CSS وجود داراست که پیش از آن بایستی استدلال کامپایل را بدانیم. نکات متعددی دراین باره قابل مشاجره میباشد که در پایین به مهم ترین آنان اشاره میکنیم:

عدم به کار گیری از کل المان های بوت استرپ در وبسایت
وسعت بالای فولدر bootstrap.css
عدم قابلیت مخلوط با پوشه های css دیگر به جهت وسعت بالا
ارتقا سرعت بار گذاری صفحه های اینترنت
بهبود امتیاز بهینه سازی و جايگاه بهتر در حاصل کاوش
قابلیت و امکان سفارشی سازی، فارسی سازی و استعمال در پروژه های متعدد
برای انجام این فعالیت، نحوه های متعددی وجود داراست که درین نوشته ی علمی قصد داریم شایسته ترین طریق ها را بیان کنیم تا برگه اینترنت ما علاوه بر سرعت مطلوب از امتیاز بهینه سازی خیر نیز منفعت مند خواهد شد.

شیوه های کامپایل فولدر های SCSS به CSS
طرز اولیه - به کارگیری از اپلیکیشن کوالا: کوالا قابل انعطاف افزاری ذیل ویندوز هست که به وسیله آن می‌توانید فولدر های SCSS را به CSS تبدیل فرمایید. بعداز اخذ و نصب این اپلیکیشن، فولدر bootstrap را در اپلیکیشن گشوده کرده، آن‌گاه روی آن راست کلیک کرده و مورد Set Output Path را تعیین فرمائید و نشانی فولدر Bootstrap.css را به اپلیکیشن بدهید. از این پس هر تغییری در پوشه Boostrap.scss بدهید، بعد از کلیک بر روی دکمه Compile، تغییرات اعمال گردیده و پوشه Bootstrap.scss به Bootstrap.css کامپایل می گردد. برای توضیحات بیشتر میتوانید فیلم یادگرفتن کامپایل را در اولِ همین نوشته‌علمی ملاحظه کنید.

کوالا - koala

در فولدر Bootstrap.scss همگی فولدر های import گردیده اند که از این شیوه می‌توانید فولدر هایی که به آن‌ها نیازی ندارید را از لیست حذف کرده و یا این که فایلی نو import نمائید.

نحوه دوم - افزونه WP-SCSS: در شرایطی‌که از سیستم مدیر محتوای وردپرس استعمال می‌کنید، برای انجام این فعالیت یک افزونه وجود داراست که نشانی پوشه های CSS و SCSS را می گیرد و عملیات کامپایل را بعد از هر تغییر و تحول انجام می‌دهد.



طرز سوم - استعمال از Elixir : خدمت Elixir در چارچوب قابل انعطاف افزاری لاراول با ارائه ی API های کارامد و با صرفه به شما این قابلیت را میدهد تا علاوه بر کامپایل فولدر های SCSS به CSS بتوانید پوشه های CSS را به طور با صرفه Minify نمایید. نکته ای که در خصوص Laravel Elixir وجود دارااست این میباشد که پیش از نصب و استعمال از آن می بایست Node.js را بر در پروژه خویش نصب نمائید.





:: برچسب‌ها: طراحی سایت شرکتی ,
:: بازدید از این مطلب : 13
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
تاریخ انتشار : پنج شنبه 29 آبان 1399 | نظرات ()
مطالب مرتبط با این پست
لیست
می توانید دیدگاه خود را بنویسید


نام
آدرس ایمیل
وب سایت/بلاگ
:) :( ;) :D
;)) :X :? :P
:* =(( :O };-
:B /:) =DD :S
-) :-(( :-| :-))
نظر خصوصی

 کد را وارد نمایید:

آپلود عکس دلخواه: